<template>
  <div>
    <h2 style="text-align: center">个人信息初始化</h2>
    <el-form ref="form" label-width="100px" v-model="employee" :rules="rule">

      <el-row>
        <el-col :span="6">
          <el-form-item label="员工id">
            <el-input v-model="employee.userId" disabled="true"></el-input>
          </el-form-item>
        </el-col>
        <!--        <el-col :span="8">-->
        <!--          <el-form-item label="活动区域">-->
        <!--            <el-select v-model="employee.userId" placeholder="请选择活动区域">-->
        <!--              <el-option label="区域一" value="shanghai"></el-option>-->
        <!--              <el-option label="区域二" value="beijing"></el-option>-->
        <!--            </el-select>-->
        <!--          </el-form-item>-->
        <!--        </el-col>-->
        <el-col :span="6">
          <el-form-item label="员工姓名" >
            <el-input v-model="employee.username"disabled="true"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="员工性别" prop="gender">
            <el-input v-model="employee.gender" maxlength="1"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="4">
          <el-form-item label="民族" prop="nationId">
            <el-input v-model="employee.nationId" maxlength="4" ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="6">
          <el-form-item label="政治面貌" prop="politicaltype">
            <el-input v-model="employee.politicaltype" maxlength="5" ></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="16">
          <el-form-item label="地址" prop="address">
            <el-input v-model="employee.address"   maxlength="25" ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="8">
          <el-form-item label="身份证号" prop="Idcards">
            <el-input v-model="idcard"  maxlength="18" ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="电话号码：" prop="phone">
            <el-input v-model="employee.phone"  maxlength="11" ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="最高学历" prop="education">
            <el-input v-model="employee.education" maxlength="16" ></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="10">
          <el-form-item label="专业" prop="educationsubject">
            <el-input v-model="employee.educationsubject" maxlength="16">

            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="毕业院校" prop="school">
            <el-input v-model="employee.school" maxlength="16" ></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="8">
          <el-form-item label="部门id">
            <el-input v-model="employee.departmentId" disabled="true"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="部门名称">
            <el-input v-model="employee.departmentName" disabled="true"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="个人工号">
            <el-input v-model="employee.workId" disabled="true"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="8">
          <el-form-item label="职位">
            <el-input v-model="employee.workName" disabled="true"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="基本工资">
            <el-input v-model="employee.baseSalary" disabled="true"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="邮箱" prop="emails">
            <el-input v-model="employee.email"   prop="address"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row style="text-align: center">
        <el-button @click="change">提交信息</el-button>
        <el-button @click="returnlogin">返回首页</el-button>
      </el-row>
    </el-form>
  </div>
</template>

<script>
  import {reloadEmployeeOnIdAndName} from '../../viewjs/personal_informationHandler'
    export default {
        name: "create_person",
      data() {
        return {
          employee: {
            userId: "",
            username: "",
            email:"",
            gender: "",
            politicaltype: "",
            nationId: "",
            address: "",
            phone: "",
            education: "",
            educationsubject: "",
            school: "",
            departmentId: "",
            departmentName: "",
            workId: "",
            workName: "",
            baseSalary:""
          },
          idcard:"",
          rule:{
            gender:[{required:true,message:"输入男/女",trigger:"blur"}],
            Idcards:[{required:true,message:"输入18位身份证号",trigger:"blur"}],
            emails:[{required:true,message:"输入格式xx@%%.com",trigger:"blur"}],
            politicaltype:[{required:true,message:"输入政治面貌",trigger:"blur"}],
            nationId: [{required:true,message:"输入民族",trigger:"blur"}],
            address: [{required:true,message:"输入地址",trigger:"blur"}],
            phone: [{required:true,message:"输入11位电话号码",trigger:"blur"}],
            education: [{required:true,message:"输入最高学历",trigger:"blur"}],
            educationsubject: [{required:true,message:"输入专业",trigger:"blur"}],
            school: [{required:true,message:"输入毕业院校",trigger:"blur"}],
          }
        }
      },

      mounted(){
        this.reloadEmployeeOnIdAndName()
      },
      methods:{

        reloadEmployeeOnIdAndName,

        change()
        {
          alert("111")
          var id = this.idcard.toString()
          alert(id)
          this.$axios.post("/updateAcceptDepartmentById",{
            userId:this.employee.userId,
            userName: this.employee.username,
            gender: this.employee.gender,
            email: this.employee.email,
            idcard: id,
            politicaltype: this.employee.politicaltype,
            nationId: this.employee.nationId,
            address: this.employee.address,
            phone: this.employee.phone,
            education: this.employee.education,
            educationsubject: this.employee.educationsubject,
            school: this.employee.school,
          }).then((res)=>{
            if(res.status == 200)
            {
              this.$axios.post("/updateusernameAndemailById",{
                userId:this.employee.userId,
                username:this.employee.username,
                email:this.employee.email
              }).then((resp)=>{

              })
              this.$message.success(res.data.msg)

            }else{
              this.$message.error(res.data.msg)
            }
            this.$store.commit("setviewPage",1);
            this.$router.push({path:"/firstview"})


          })
        },
        returnlogin(){
          this.$store.commit("setviewPage",1);
          this.$router.push({path: '/home'});
        }
      }
    }
</script>

<style scoped>

</style>
